<template>
    <div class="index">
        <!--<router-view></router-view>-->
        <div v-if="currentIndex === 0"><New/></div>
        <div v-else-if="currentIndex === 1"><Project :is-show-add = 'isShowAdd'/></div>
        <!--<div v-else-if="currentIndex === 2"><Create/></div>-->
        <div v-else-if="currentIndex === 3"><Share/></div>
        <div v-else-if="currentIndex === 4"><Person/></div>
        <tabbar></tabbar>
    </div>
</template>

<script>
    import Tabbar from './common/Tabbar';
    import New from './new/New';
    import Project from './project/Project'
    // import Create from './create/Create'
    import Share from './share/Share'
    import Person from './person/Person'

    export default {
        name: 'Index',
        components: {Tabbar,New,Project,Share,Person},
        data() {
            return {
                currentIndex: 0,
                isShowAdd: false,
                level: 0,
            }
        },
        created() {
            if(this.$route.params.index) {
                this.currentIndex = this.$route.params.index;
            }
        },

    }
</script>

<style scoped>
    @import '../assets/css/index.css';

    .index {
        margin-bottom: 110px;
        display:flex;
        display: -webkit-flex;
        height:100%;
        flex-direction:column;
        box-sizing: border-box;
    }
</style>